import 'package:flutter/material.dart';
class Test12 extends StatefulWidget{
    _TestState createState() => _TestState();
}

class _TestState extends State<Test12> {

    

    @override
    Widget build(BuildContext context) {

        return DefaultTabController(
            length: choices.length,
            child: Scaffold(
                appBar: AppBar(
                    title: Text("选项卡式的AppBar"),
                    centerTitle: true,
                    bottom: TabBar(
                        isScrollable: true,
                        unselectedLabelColor:Colors.red,
                        indicatorColor:Colors.green,
                        tabs: <Widget>[
                            Tab(
                                text: "1",
                            ),
                            Tab(
                                text: "2",
                            ),
                            Tab(
                                text: "3",
                            ),
                            Tab(
                                text: "4",
                            ),
                            Tab(
                                text: "5",
                            ),
                            Tab(
                                text: "6",
                            )
                        ],
                        // tabs: choices.map((Choice choice){
                        //     return Tab(
                        //         text: choice.title,
                        //         icon: Icon(choice.icon),
                        //     );
                        // }).toList(),
                    ),
                ),
                body: TabBarView(
                    children: <Widget>[
                        Container(
                            child: Text("11"),
                        ),
                        Container(
                            child: Text("22"),
                        ),
                        Container(
                            child: Text("33"),
                        ),
                        Container(
                            child: Text("44"),
                        ),
                        Container(
                            child: Text("55"),
                        ),
                        Container(
                            child: Text("66"),
                        ),

                    ],
                    // children: choices.map((Choice choice){
                    //     return Padding(
                    //         padding: EdgeInsets.all(16.0),
                    //         child: ChoiceCard(choice: choice),
                    //     );
                    // }).toList(),
                ),
            ),
        );
    }
}


class Choice{
    const Choice({this.title,this.icon});
    final String title;
    final IconData icon;
}

const List<Choice> choices = const <Choice>[
    const Choice(title: 'Car',icon: Icons.directions_car),
    const Choice(title: 'Bicycle',icon: Icons.directions_bike),
    const Choice(title: 'BOAT', icon: Icons.directions_boat),
    const Choice(title: 'BUS', icon: Icons.directions_bus),
    const Choice(title: 'TRAIN', icon: Icons.directions_railway),
    const Choice(title: 'WALK', icon: Icons.directions_walk),
];

class ChoiceCard extends StatelessWidget{
    ChoiceCard({this.choice});
    final Choice choice;
    @override
    Widget build(BuildContext context){
        return Card(
            color: Colors.white,
            child: Center(
                child: Column(
                    mainAxisSize: MainAxisSize.min,
                    crossAxisAlignment: CrossAxisAlignment.center,
                    children: <Widget>[
                        Icon(choice.icon,size: 128.0,color: Colors.red),
                        Text(choice.title),
                    ],
                ),
            ),
        );
    }

}
